/*
 * @version: 1.0.0
 * @Author: Rattenking
 * @Date: 2022-10-18 09:40:46
 */
import { Component } from "react";
import { View, Text } from "@tarojs/components";
import menuList from "./menuList";
import "./index.scss";

export default class Index extends Component {
  // "autoprefixer": "10.4.16",
  // "postcss": "8.4.27",
  // "tailwindcss": "3.3.3",
  // "weapp-tailwindcss": "^2.4.0"
  // https://github.com/sonofmagic/taro-react-tailwind-vscode-template
  // 示例模板地址
  render() {
    return (
      <View className="rui-index-page-content">
        <View className="p-4 bg-blue-500">
          <Text className="text-white text-[20px] flex items-center">
            Hello, Tailwind CSS!
          </Text>
        </View>
        <View style={{ height: "fit-content(200px)" }}></View>
        <View className="rui-list-content">
          {menuList.map((item, index) => (
            <View
              className="rui-flex-ac rui-list-item"
              key={item + index}
              onClick={this.$route.bind(this, { url: item.url })}
            >
              <Text className="rui-fs30 rui-fg rui-line1">{item.title}</Text>
              <Text className="rui-icon rui-icon-arrow-right rui-fa rui-fs30"></Text>
            </View>
          ))}
        </View>
      </View>
    );
  }
}
